import React, { Component } from 'react';

import { Menu } from 'antd';
import './menu_item.css'

const { SubMenu } = Menu;

export default class Menu_item extends Component {
    menuKeys = ['sub1', 'sub2', 'sub4'];

    // state = {
    //     openKeys: ['sub1'],
    // };

    // onOpenChange = openKeys => {
    //     const latestOpenKey = openKeys.find(key => this.state.openKeys.indexOf(key) === -1);
    //     if (this.menuKeys.indexOf(latestOpenKey) === -1) {
    //         this.setState({ openKeys });
    //     } else {
    //         this.setState({
    //             openKeys: latestOpenKey ? [latestOpenKey] : [],
    //         });
    //     }
    // };

    render() {
        return (
            <Menu
                mode="inline"
                // openKeys={this.state.openKeys}
                // onOpenChange={this.onOpenChange}
            >
                <SubMenu
                    // key="sub1"
                    title={
                        <span>
                            <span>主菜单</span>
                        </span>
                    }
                >
                    <Menu.Item key="1">家</Menu.Item>
                    <Menu.Item key="2">面巾</Menu.Item>
                    <Menu.Item key="3">口罩</Menu.Item>
                    <Menu.Item key="4">卫衣和卫衣</Menu.Item>
                    <Menu.Item key="5">袖套</Menu.Item>
                </SubMenu>
                <SubMenu key="sub4" title="页脚菜单">
                    <Menu.Item key="6">搜索</Menu.Item>
                    <Menu.Item key="7">联系我们</Menu.Item>
                    <Menu.Item key="8">隐私政策</Menu.Item>
                    <Menu.Item key="9">退货与退款政策</Menu.Item>
                    <Menu.Item key="10">运送与常见问题</Menu.Item>
                    <Menu.Item key="11">服务条款</Menu.Item>
                </SubMenu>
            </Menu>
        );
    }
}